import 'package:flutter/material.dart';
import 'package:goods_sample/widget/swiper/widget_swiper.dart';

class GoodsDetailWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) => MaterialApp(debugShowCheckedModeBanner: false, home: _GoodsDetailContainerWidget());
}

class _GoodsDetailContainerWidget extends StatefulWidget {
  @override
  _GoodsDetailItemWidget createState() => _GoodsDetailItemWidget();
}

class _GoodsDetailItemWidget extends State<_GoodsDetailContainerWidget> {
  @override
  Widget build(BuildContext context) => CustomScrollView(
      slivers: [_buildSliverAppBar(context), _buildContentContainer(context)]);

  //
  Widget _buildSliverAppBar(BuildContext context) {
    double size = MediaQuery.of(context).size.width;
    return SliverAppBar(
      expandedHeight: size,
      leading: Container(child: BackButton(onPressed: () => Navigator.pop(context))),
      pinned: true,
      elevation: 5,
      actions: _buildActions(),
      backgroundColor: Colors.orange,
      flexibleSpace: FlexibleSpaceBar(
        collapseMode: CollapseMode.parallax,
        background: _buildSliverAppBarContent(context, size),
      ),
    );
  }

  List<Widget> _buildActions() => <Widget>[
        IconButton(
            icon: Icon(
              Icons.share,
              color: Colors.white,
            ),
            onPressed: null),
        IconButton(
            icon: Icon(
              Icons.star_border,
              color: Colors.white,
            ),
            onPressed: null)
      ];

  Widget _buildSliverAppBarContent(BuildContext context, double size) => Container(
      width: size,
      height: size,
      color: Colors.orange,
      child: Swiper(
          itemCount: 5,
          pagination: SwiperPagination(),
          itemBuilder: (context, index) => Image.network('https://cbu01.alicdn.com/img/ibank/2020/008/956/19872659800_1029509517.460x460xz.jpg')));

  Widget _buildContentContainer(BuildContext context) {
    return SliverList(
        delegate: SliverChildBuilderDelegate((context, index) => Container(
          color: Colors.white,
          padding: EdgeInsets.all(10),
          child: Text('$index',
              style: TextStyle(
                  fontSize: 14,
                  color: Colors.orange,
                  fontStyle: FontStyle.normal))),
            childCount: 20));
  }
}
